import {Component} from 'react'

export class FlowPortWidget extends Component {
    constructor (props) {
        super(props)
        this.state = {
            selected: false,
        }
    }

    render () {
        const { node, children, name, wrapper,  ...attributes } = this.props
        const nodeId = (typeof node.getID === 'function' ? node.getID() : "")

        return (
                <svg
                    style={{ width: wrapper.state.width, height: wrapper.state.height }}
                    className="polygon realPort"
                    data-name="flowPort"
                    data-nodeid={nodeId}
                >
                    <g style={{ width: wrapper.state.width, height: wrapper.state.height,transform : "scale(" + wrapper.state.transformX + "," + wrapper.state.transformY + ")"}} wrapper={wrapper}>
                        {children}
                    </g>
                    <text x="50%" y="55%" textAnchor="middle"  style={{fill:"#ffffff", fontFamily:"Arial", fontSize:"11px"}}>{name}</text>
                </svg>
        )
    }
}
